<!--
  Generated template for the NodeListPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <div class="N-head">
      <ion-searchbar placeholder="查找充电站" [(ngModel)]="siteone" (input)="search()"></ion-searchbar>
      <div class="nodeview">
        <!--<ion-icon name="add"></ion-icon>-->
        <img src="assets/imgs/near.png" alt="" height="24" (click)="near()"/>
      </div>
    </div>
  </ion-navbar>

</ion-header>


<ion-content class="list-avatar-page">
  <!--<div class="segment-container">
    <ion-segment [(ngModel)]="pet">
      <ion-segment-button value="puppies">
        距离最近
      </ion-segment-button>
      <ion-segment-button value="kittens">
        空闲优先
      </ion-segment-button>
    </ion-segment>
  </div>-->
  <ion-list class="node-list" *ngIf="!siteone">
    <div *ngFor="let site of site2">
      <ion-item (click)="skipToChargingBattery(site)">
        <h2>{{site.charging_pile_name}}</h2>
        <p class="address">{{site.address}}</p>
        <ion-note item-end *ngIf="site.distance > 999 && Internet == 1">{{ (site.distance / 1000) | number : '1.0-2'}}km</ion-note>
        <ion-note item-end *ngIf="site.distance <= 999 && Internet == 1">{{ site.distance | number : '1.0-2'}}m</ion-note>
      </ion-item>
      <p class="device-detail">共<span class="sum">{{site.charging_unit_List.length}}</span>个设备
    </div>
    <!--<ion-item>
      <h2>南宁广告产业园负一楼</h2>
      <p class="address">广西南宁市西乡塘区滨河路88号</p>
      <ion-note item-end>0.3km</ion-note>
    </ion-item>
    <p class="device-detail">共<span class="sum">5</span>个设备<span class="free">2</span>个空闲</p>

    <ion-item>
      <h2>南宁广告产业园负一楼</h2>
      <p class="address">广西南宁市西乡塘区滨河路88号</p>
      <ion-note item-end>0.3km</ion-note>
    </ion-item>
    <p class="device-detail">共<span class="sum">5</span>个设备<span class="free">2</span>个空闲</p>

    <ion-item>
      <h2>南宁广告产业园负一楼</h2>
      <p class="address">广西南宁市西乡塘区滨河路88号</p>
      <ion-note item-end>0.3km</ion-note>
    </ion-item>
    <p class="device-detail">共<span class="sum">5</span>个设备<span class="free">2</span>个空闲</p>-->
  </ion-list>

  <ion-list class="node-list" *ngIf="siteone">
  <div *ngFor="let site of siteFind">
    <ion-item (click)="skipToChargingBattery(site)">
      <h2>{{site.charging_pile_name}}</h2>
      <p class="address">{{site.address}}</p>
      <ion-note item-end *ngIf="site.distance > 999 && Internet == 1">{{ (site.distance / 1000) | number : '1.0-2'}}km</ion-note>
      <ion-note item-end *ngIf="site.distance <= 999 && Internet == 1">{{ site.distance | number : '1.0-2'}}m</ion-note>
    </ion-item>
    <p class="device-detail">共<span class="sum">{{site.charging_unit_List.length}}</span>个设备
  </div>
  
</ion-list>

<div id="allmap"></div>
</ion-content>